@import "../../style/worker.scss";
@import "../../style/input.scss";
@include tip;

.container {
    min-height: 100vh;
    background-color: #f9f9fa;
    padding-bottom: 150rpx;
}

.head {
    background-color: $green;
    padding: 30rpx;
}

.insurance {
    display: flex;
    color: white;
    align-items: center;
}

.insurance-detail {
    margin-left: 24rpx;
}

.insurance-name {
    font-size: $font-large;
    font-weight: bold;
}

.insurance-date {
    margin-top: 8rpx;
}

.insurance-icon {
    width: 100rpx;
    height: 100rpx;
    background: #eff2f5;
    border-radius: 12rpx;
}

.date {
    margin-top: 30rpx;
}

.date .after-icon.triangle {
    position: absolute;
    top: 38rpx;
}

.app-list {
    @include space-between;
    margin-top: 30rpx;
    margin-bottom: 30rpx;
}

.app {
    width: 220rpx;
    height: 134rpx;
    overflow: hidden;
    border-radius: 16rpx;
    position: relative;
}

.app-text {
    position: absolute;
    z-index: 10;
    top: 51rpx;
    left: 82rpx;
}

.worker-list {
    margin-top: -30rpx;
    border-radius: 36rpx;
    background-color: #f9f9fa;
}

.title {
    @include space-between;
    padding: 30rpx 0;
}

.title-text {
    font-weight: bold;
    font-size: $font-normal;
}

.title-btn {
    border: 1px solid $green;
    color: $green;
    border-radius: 40rpx;
    padding: 4rpx 12rpx;
}

.worker-list {
    padding: 0 30rpx;
}

.foot-btn {
    @include padding-box(6rpx 30rpx);
    z-index: 999 !important;
}

.count .big {
    font-size: 46rpx;
    font-weight: bold;
}

.short-btn.active {
    margin-right: 0;
    height: 88rpx;
}

.input-box .before-icon {
    top: 25rpx;
}

.worker-box {
    display: flex;
    align-items: center;
    margin-top: 30rpx;
}

.worker-select {
    margin-right: 20rpx;
}

.worker {
    width: 100%;
    margin-top: unset;
}

.mini-btn.active:not([size="mini"]) {
    margin: 0;
    width: 320rpx;
}

.mini-btn.del:not([size="mini"]) {
    margin-right: 20rpx;
    width: 150rpx;
    border-color: #dee0e3;
    color: white;
}

.all-select {
    display: flex;
    align-items: center;
}

.all-select-icon {
    margin-right: 10rpx;
}

.popup-form .input-box .input {
    width: 610rpx !important;
}

.popup .title {
    margin-top: 20rpx;
    margin-bottom: 0;
}

.short-btn.popup-btn:not([size="mini"]) {
    margin-top: 40rpx;
}

.invite-code .popup {
    background-color: $green;
}

.invite-code .code-box {
    width: 550rpx;
    height: 650rpx;
    overflow: hidden;
    margin: 0 auto;
    position: relative;

    .rect {
        width: 550rpx;
        height: 570rpx;
        background-color: white;
        position: absolute;
        z-index: 1;
        border-radius: 16rpx 16rpx 0 0;
    }

    .circle {
        height: 160rpx;
        width: 568rpx;
        background: white;
        border-radius: 100%;
        position: absolute;
        top: 476rpx;
        left: -8.5rpx;
    }

    .title {
        font-size: 50rpx;
        font-weight: bold;
    }

    .line {
        width: 445rpx;
        border-top: 1px dashed $grey;
        margin: 0 auto;
    }

    .endtime {
        margin-top: 16rpx;
        font-size: $font-small;
    }

    .invite-img {
        width: 290rpx;
        height: 290rpx;
        margin-top: 38rpx;
        margin-bottom: 24rpx;
    }

    .scanftip {
        text-align: center;
    }
}

.invite-code .short-btn:not([size="mini"]) {
    background-color: white;
    color: $green;
    font-weight: bold;
    width: 340rpx;
    margin: 40rpx 0;
}

.invite-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 10;
}

.purse {
    position: absolute;
    width: 88vw;
    height: 250rpx;
    right: 5rpx;
    top: 0;
}

.policy-amount {
    position: relative;
    font-size: $font-normal;
    line-height: 45rpx;
    z-index: 1;

    .policy-describe {
        margin-top: 47rpx;
    }

    .name {
        color: #202536;
        font-size: 32rpx;
    }

    .active {
        margin-top: 30rpx;
    }
}

.characters-text {
    font-weight: 600;
}

.remind-autology {
    line-height: 120rpx;
}

.mini-btn:not([size="mini"]) {
    margin: 30rpx auto 20rpx auto;
    background: $green;
    border: none;
    color: white;
}

.mini-btn.define:not([size="mini"]) {
    margin: 0;
    width: 265rpx;
}

.row-around {
    align-items: baseline;
}

.mini {
    letter-spacing: 2rpx;
}

.policy-btn-box {
    margin-top: 60rpx;
    width: 100%;
}

.mini-btn.cancel:not([size="mini"]) {
    margin: 0;
    width: 264rpx;
    background-color: #ffffff;
    border: 2rpx solid #e8e9ea;
    color: #202536;
}

.work-pop {
    width: 100%;
}

.work-pop-box {
    padding: 60rpx 30rpx 0 30rpx;
}

.work-pop-box .key {
    font-size: $font-normal;
    font-weight: bold;
}

.work-pop-box .key .red {
    font-weight: normal;
    margin-right: 3rpx;
}

.ocr-icon {
    width: 46rpx;
    height: 46rpx;
    margin: 0 auto;
}

.after-icon {
    font-size: 20rpx;
    color: $green;
    text-align: center;
    z-index: 10;
}

.input-box-active {
    background: #fff;
    border: 1px solid #dee0e3;
    border-radius: 12rpx;
    overflow: hidden;
}

.btn-box {
    .mini-btn-active:not([size="mini"]) {
        border: 1rpx solid #dee0e3;
        color: #646a73;
        background: #ffffff;
    }
}

.popup_top {
    width: 100%;
    min-height: 210rpx;
    background-color: #fafafc;
    padding: 32rpx;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    .name {
        color: black;
        flex: 2;
    }
    .msg {
        color: black;
        flex: 3;
    }
    .top {
        display: flex;
        width: 100%;
    }
    .errmsginfo {
        width: 100%;
        height: 180rpx;
        overflow-y: scroll;
        .item {
            width: 100%;
            display: flex;
            height: 50rpx;
            line-height: 50rpx;
        }
    }
}

.popup_bottom {
    width: 100%;
    margin-top: 60rpx;
    box-sizing: border-box;
    padding: 0 32rpx;
    display: flex;
    justify-content: space-around;

    .cancel {
        color: #202536;
        font-size: 36rpx;
        width: 264rpx;
        height: 92rpx;
        line-height: 92rpx;
        border-radius: 47rpx 47rpx 47rpx 47rpx;
        opacity: 1;
        border: 2rpx solid #e8e9ea;
        text-align: center;
    }

    .sure {
        color: #ffffff;
        font-size: 36rpx;
        text-align: center;
        width: 264rpx;
        height: 92rpx;
        line-height: 92rpx;
        background: #00d679;
        border-radius: 47rpx 47rpx 47rpx 47rpx;
        opacity: 1;
    }
}

.ts {
    margin-top: 32rpx;
    .img {
        width: 28rpx;
        height: 28rpx;
    }
}

.errtop {
    font-size: 28rpx;
    width: 100%;
    margin-bottom: 16rpx;
}
.errtopc {
    font-size: 32rpx;
    width: 100%;
    margin-bottom: 16rpx;
}
.errbord {
    font-weight: bolder;
    color: black;
}
.titlebord {
    font-weight: bold;
    font-size: 28rpx;
}

.redTag {
    font-size: 20rpx;
    color: #ff7642;
    border-radius: 8rpx;
    background: rgba(255, 118, 66, 0.1);
    padding: 6rpx 12rpx;
    box-sizing: border-box;
    min-width: 140rpx;
    height: 32rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.selectimg {
    flex-shrink: 0;
    width: 28rpx;
    height: 28rpx;
}

.flex-c {
    display: flex;
    align-items: center;
}

.fc565868 {
    color: #565868;
}

.mypopup .weui-half-screen-dialog__ft {
    display: none;
}
.mypopup .weui-half-screen-dialog__hd {
    display: none;
}
.mypopup .weui-half-screen-dialog__bd {
    padding-bottom: 20rpx !important;
}

.mypopup {
    padding: 0 20rpx;
    .descbox {
        width: 100%;
        box-sizing: border-box;
        padding-bottom: 40rpx;
    }

    .title {
        display: flex;
        align-items: center;
        justify-content: space-between;

        .l {
            display: flex;
            align-items: center;
            gap: 16rpx;
            color: #202536;
            font-size: 36tpx;
            font-weight: 700;

            .img {
                width: 40rpx;
                height: 40rpx;
            }
        }

        .closeimg {
            z-index: 999;
            width: 40rpx;
            height: 40rpx;
        }
    }
}
